package com.frxuexi.mdm2204.demo

import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.pager.HorizontalPager
import androidx.compose.foundation.pager.rememberPagerState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.unit.dp
import coil.compose.AsyncImage

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun Demo05() {

    var state=rememberPagerState {
        5
    }

    var list=listOf<String>(
        "https://img0.baidu.com/it/u=3517553771,449336921&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1726160400&t=1ea2f6dfe914e245595abc8df03bfbf9",
        "https://img0.baidu.com/it/u=3265942824,2806644621&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1726160400&t=818df6ae381f5479fa0a4be7f2c86530",
        "https://img1.baidu.com/it/u=3227500530,2626385610&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1726160400&t=64117b94e86afa8f818c28dfeaafb800",
        "https://img0.baidu.com/it/u=3761852498,1141296310&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1726160400&t=be3eb1cd1149b9d0e3edd5229da0fe6d",
        "https://img1.baidu.com/it/u=2866747747,903488980&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1726160400&t=4097de985adf544696c4995e5cc176e5"
    )

    Column(horizontalAlignment = Alignment.CenterHorizontally) {
        HorizontalPager(state = state, verticalAlignment = Alignment.Top) {
            AsyncImage(model = list.get(it), contentDescription = "",
                contentScale= ContentScale.FillBounds,
                modifier = Modifier
                    .fillMaxWidth()
                    .height(300.dp))
        }

        Row(horizontalArrangement = Arrangement.spacedBy(10.dp), modifier = Modifier.offset(y=-40.dp)) {
            repeat(state.pageCount){
                var color=if(it==state.currentPage) Color.DarkGray else Color.Gray
                Box(modifier = Modifier.size(10.dp).background(color = color, CircleShape))
            }
        }
    }

}